{% macro display_actor_inline(follower, default_avatar, size=50,actions={}) -%}
{% if follower and follower.id %}
<div class="actor-box">
<span style="float:left;padding-right:10px">
{% if not follower.icon %}
<img class="actor-icon" src="{{ default_avatar }}" style="width:50px;height:50px">
{% else %}
<img class="actor-icon" src="{{ follower.icon.url }}" style="width:50px;height:50px">{% endif %}
</span>
{% if actions.followbtn %}
<div class="actor-button">
<form action="/api/follow" class="action-form" method="POST">
<input type="hidden" name="redirect" value="{{ request.path }}"/>
<input type="hidden" name="actor" value="{{ follower.id }}"/>
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
<button type="submit" class="bar-item pure-button">follow</button>
</form>
</div>
{% endif %}
{% if actions.unfollowbtn %}
<div class="actor-button">
<form action="/api/undo" class="action-form"  method="POST">
<input type="hidden" name="redirect" value="{{ request.path }}"/>
<input type="hidden" name="id" value="{{ fid }}"/>
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
<button type="submit" class="bar-item pure-button">unfollow</button>
</form>
</div>
{% endif %}
<div class="actor-inline">
<a href="{{follower | url_or_id | get_url }}" style="font-weight:bold">{{ follower.name or follower.preferredUsername }}</a><br/>
<small class="lcolor">@{{ follower.preferredUsername }}@{{ follower | url_or_id | get_url | domain }}</small>
</div>
</div>
{% endif %}
{%- endmacro %}

{% macro display_note(obj, default_avatar, perma=False, ui=False, likes=[], shares=[], meta={}, no_color=False, index=False, limit=0) -%}

{% if meta.actor %}
    {% set actor = meta.actor %}
{% else %}
    {% set actor = obj.attributedTo | get_actor  %}
{% endif %}

{% if session.logged_in %}
    {% set perma_id = obj.id | permalink_id %}

    {% if request.args.get('older_than') %}
        {% set redir = request.path + "?older_than=" + request.args.get('older_than') + "#activity-" + perma_id %}
    {% elif request.args.get('newer_than') %}
        {% set redir = request.path + "?newer_than=" + request.args.get('newer_than') + "#activity-" + perma_id %}
    {% else %}
    {% set redir = request.path + "#activity-" + perma_id %}
    {% endif %}

    {% set aid = obj.id | quote_plus %}
{% endif %}
<section class="post">
<header class="post-header">
<img width="48" height="48" class="post-avatar" src="{% if not actor.icon %}{{ default_avatar }}{% else %}{{ actor.icon.url }}{% endif %}">
<p class="post-meta">
<a href="{{ actor | url_or_id | get_url }}" class="no-hover"><strong>{{ actor.name or actor.preferredUsername }}</strong>
<span class="l">@{% if not no_color and obj.id | is_from_outbox %}<span class="pcolor">{{ actor.preferredUsername }}</span>{% else %}{{ actor.preferredUsername }}{% endif %}@{% if not no_color and obj.id | is_from_outbox %}<span class="pcolor">{{ actor | url_or_id | get_url | domain }}</span>{% else %}{{ actor | url_or_id | get_url | domain }}{% endif %}</span></a> published
<a rel="noopener" class="u-url u-uid note-permalink l" href="{{ obj | url_or_id | get_url }}"><time  title="{{ obj.published }}" datetime="{{ obj.published }}">{{ obj.published | format_timeago }}</time></a>
</p>
</header>
<div class="post-description">
	{% if obj.summary %}<p class="p-summary">{{ obj.summary | clean }}</p>{% endif %}
    {% if obj | has_type('Video') %}
    <div class="note-video">
    <video controls preload="metadata"  src="{{ obj.url }}" width="480">
    </video>
    </div>
    {% endif %}
    <div class="note-container{% if perma %} perma{%endif%} p-name e-content">
    {% if obj | has_type('Article') %}
        {{ obj.name }} <a href="{{ obj | url_or_id | get_url }}">{{ obj | url_or_id | get_url }}</a>
    {% elif obj | has_type('Question') %}
	{% if index and limit != 0 and obj.content|length > limit %}
            {{ obj.content | truncate(limit) | clean | safe }}
            <a href="{{ obj | url_or_id | get_url }}">Read more.</a>
        {% else %}
            {{ obj.content | clean | safe }}
        {% endif %}

        {% if obj.id | is_from_outbox or (meta.question_replies and (obj.closed or meta.voted_for)) %}
        <ul style="list-style:none;padding:0;">
        {% set total_votes = meta.question_replies %}

        {% for oneOf in obj.oneOf %}
            {% set pct = 0 %}
            {% if total_votes > 0 %}
                {% set cnt = oneOf.name | get_answer_count(meta) %}
                {% set pct = cnt * 100.0 / total_votes %}
            {% endif %}
            <li class="answer">
                <span class="answer-bar color-menu-background" style="width:{{pct}}%;"></span>
                <span class="answer-text">
                    <span>{{ '%0.0f'| format(pct) }}%</span>
                    {{ oneOf.name }} 
                </span>
            </li>
        {% endfor %}
    </ul>
    <p><small>
    {% if obj.closed or obj.endTime | gtnow %}
        Ended {{ obj.endTime | format_timeago }} with <strong>{{ total_votes }}</strong> vote{% if total_votes | gtone %}s{% endif %}.
    {% else %}
        Ends {{ obj.endTime | format_timeago }} (<strong>{{ total_votes }}</strong> vote{% if total_votes | gtone %}s{% endif %} as of now).
    {% endif %}
    </small></p>
    {% else %}

    <ul style="list-style:none;padding:0;">
    {% for oneOf in obj.oneOf %}
    <li class="answer">
<span class="answer-text">

{% if not meta.voted_for and not obj.endTime | gtnow %}
<span><form action="/api/vote" class="action-form"  method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ obj.id }}">
<input type="hidden" name="choice" value="{{ oneOf.name }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item">vote</button>
</form></span>
{% else %}
    <span>???</span>
{% endif %}
{{ oneOf.name }} {% if oneOf.name == meta.voted_for %}(your vote){% endif %}
</span>
    </li>
    {% endfor %}
    <p><small>{% if obj.endTime | gtnow %}This question ended {{ obj.endTime | format_timeago }}.</small></p>
    {% else %}This question ends {{ obj.endTime | format_timeago }}{% endif %}
    </small></p>
    </ul>
    

    {% endif %}

    {% else %}
	{% if index and limit != 0 and obj.content|length > limit %}
            {{ obj.content | truncate(limit) | clean | safe }}
            <a href="{{ obj | url_or_id | get_url }}">Read more.</a>
        {% else %}
            {{ obj.content | clean | safe }}
        {% endif %}
    {% endif %}
	</div>

	{% if obj.attachment and obj | has_type('Note') %}
	<div style="padding:20px 0;">
	{% if obj.attachment | not_only_imgs %}
	<h3 class="l">Attachments</h3>
	<ul style="padding:0;">
	{% endif %}
	{% for a in obj.attachment %}
    {% if (a.mediaType and a.mediaType.startswith("image/")) or (a.type and a.type == 'Image') %}
    <a href="{{ a.url | get_attachment_url(None) }}"><img src="{{a.url }}" class="img-attachment"></a>
    {% elif (a.mediaType and a.mediaType.startswith("video/")) %}
    <li><video controls preload="metadata"  src="{{ a.url }}" width="480"></video></li>
	{% else %}
	<li><a href="{{a.url }}" class="l">{% if a.filename %}{{ a.filename }}{% else %}{{ a.url }}{% endif %}</a></li>
	{% endif  %}
	{% endfor %}
	{% if obj.attachment | not_only_imgs %}
	</ul>
	{% endif %}
</div>
	{% endif %}



{% if meta and meta.og_metadata and obj | has_type('Note') %}
{% for og in meta.og_metadata %}
{% if og.url %}
<a href="{{ og.url }}" class="og-link" style="margin:30px 0;clear:both;display: flex;">
<div>
<img  style="width:100px;border-radius:3px;" src="{{ og.image }}">
</div>
<div style="padding:0 20px;">
<strong>{{ og.title }}</strong>
<p>{{ og.description | truncate(80) }}</p>
<small>{{ og.site_name }}</small>
</div>
</a>
{% endif %}
{% endfor %}
{% endif %}



{% if perma %}<span class="perma-item" style="float:right">{{ obj.published | format_time }}</span>{% endif %}
<div class="bottom-bar pure-button-group" role="group">
{% if perma %}
{% if not (obj.id | is_from_outbox) %}
<a class="bar-item pure-button" href="{{ obj | url_or_id | get_url }}">permalink</a> 
{% endif %}
{% else %}
<a class="bar-item pure-button" href="{{ obj | url_or_id | get_url }}">permalink</a> 
{% endif %}
{% if meta.count_reply and obj.id | is_from_outbox %}<a class ="bar-item" href="{{ obj.url | get_url }}"><strong>{{ meta.count_reply }}</strong> replies</a>
{% elif meta.count_reply and session.logged_in %}
<a class="bar-item pure-button" href="/admin/thread?oid={{aid}}"><strong>{{ meta.count_reply }}</strong> replies</a>{% endif %}

{% if not perma and meta.count_boost and obj.id | is_from_outbox %}<a class="bar-item pure-button" href="{{ obj.url | get_url }}"><strong>{{ meta.count_boost }}</strong> boosts</a>{% endif %}
{% if not perma and meta.count_like and obj.id | is_from_outbox %}<a class="bar-item pure-button" href="{{ obj.url | get_url }}"><strong>{{ meta.count_like }}</strong> likes</a>{% endif %}

{% if session.logged_in %}
{% if ui %}
{% if meta.boosted %}
<form action="/api/undo" class="action-form" method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ meta.boosted }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item pure-button">unboost</button>
</form>
{% else %}
<form action="/api/boost" class="action-form" method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ obj.id }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item pure-button">boost</button>
</form>
{% endif %}

{% if meta.liked %}
<form action="/api/undo" class="action-form" method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ meta.liked }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item pure-button">unlike</button>
</form>
{% else %}
<form action="/api/like" class="action-form" method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ obj.id }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item pure-button">like</button>
</form>
{% endif %}
{% endif %}
{% if obj.id | is_from_outbox %}
<form action="/api/note/delete" class="action-form" method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ obj.id }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item pure-button">delete</button>
</form>
{% if meta.pinned %}
<form action="/api/note/unpin" class="action-form" method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ obj.id }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item pure-button">unpin</button>
</form>
{% else %}
<form action="/api/note/pin" class="action-form" method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="id" value="{{ obj.id }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item pure-button">pin</button>
</form>
{% endif %}

{% else %}
<form action="/api/block" class="action-form" method="POST">
<input type="hidden" name="redirect" value="{{ redir }}">
<input type="hidden" name="actor" value="{{ actor.id }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="bar-item pure-button">block</button>
</form>
{% endif %}
<a class="bar-item pure-button" href="/admin/new?reply={{ aid }}">reply</a>
{% endif %}


</div>

{% if likes or shares %}
<div style="padding-top:20px;" class="pure-g">
{% if likes %}
<div class="pure-u-1-2">
<h4 style="font-weight:normal"><strong>{{ likes|length }}</strong> likes</h4>{% for like in likes %}
{{ display_actor_inline(like) }}
{% endfor %}
</div>
{% endif %}
{% if shares %}
<div class="pure-u-1-2">
<h4 style="font-weight:normal"><strong>{{ shares|length }}</strong> boosts</h4>{% for boost in shares %}
{{ display_actor_inline(boost) }}
{% endfor %}
</div>
{% endif %}
</div>
{% endif %}


</div>
</section>

{%- endmacro %}

{% macro display_thread(thread, default_avatar, likes=[], shares=[]) -%}
{% for reply in thread %}
{% if reply._requested %}
{{ display_note(reply.activity.object, default_avatar=default_avatar, perma=True, ui=False, likes=likes, shares=shares, meta=reply.meta) }}
{% else %}
{{ display_note(reply.activity.object, default_avatar=default_avatar, perma=False, ui=True, meta=reply.meta) }}
{% endif %}
{% endfor %}
{% endmacro -%}

{% macro display_pagination(older_than, newer_than) -%}
<div class="clear">
    {% if older_than %}
    <a href="{{ config.BASE_URL }}{{ request.path }}?older_than={{older_than}}{% if request.args.get('limit') %}&limit={{request.args.get('limit')}}{% endif %}" rel="next" class="older-link lcolor"><span class="pcolor">🡨</span> Older</a>
    {% endif %}
    {% if newer_than %}
    <a href="{{ config.BASE_URL }}{{ request.path }}?newer_than={{newer_than}}{% if request.args.get('limit') %}&limit={{request.args.get('limit')}}{% endif %}" rel="prev" class="newer-link lcolor">Newer <span class="pcolor">🡪</span></a>
    {% endif %}
</div>
{% endmacro -%}

{% macro display_pagination_links(older_than, newer_than) -%}
{% if older_than %}<link rel="next" href="{{ config.BASE_URL }}{{ request.path }}?older_than={{older_than}}">{% endif %}
{% if newer_than %}<link rel="prev" href="{{ config.BASE_URL }}{{ request.path }}?newer_than={{newer_than}}">{% endif %}
{% endmacro -%}
